<!DOCTYPE html>

<html>
  <head>
  </head>
  <body>
    <h1> Clusters </h1>
    <div> Showing clusters from {{offset}} to {{offset+limit}} </div>
    {% for batch in batches %}
      {% if batch[0] == offset %}
        <span style="padding:0.5em;"><b> {{batch[0]}} - {{batch[-1]}} </b></span>
      {% else %}
        <a style="padding:0.5em;" href="/clusters?offset={{ batch[0] }}&limit={{ batch |length }}">
           {{ batch[0] }} - {{ batch[-1] }}
         </a>
     {% endif %}
   {% endfor %}
   <p></p>

   {% for cluster_id in ordered_list %}
    {% set img_idx = clusters[cluster_id][0]%}
    <a href="/single_cluster?cluster={{ cluster_id }}">
    <div> ({{clusters[cluster_id] | length}} faces in cluster) </div>
      <img src="/img/{{ idx_to_path[img_idx] }}" >
    {% endfor %}
  </body>

</html>
